// pages/songDetail/songDetail.js
import request from "../../utils/request"
import PubSub from 'pubsub-js'
import moment from 'moment'
// other.js
const appInstance = getApp()
Page({
  /**
   * 页面的初始数据
   */
  data: {
    isplay:false,//音乐是否播放
    musicId:'',
    songDetail:{},//音乐详情对象
    musicLink:'',//音乐链接
    currentTime:'00:00',//实时时间
    durationTime:'00:00',//总时长 
    currentWidth:0,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 获取音乐id
    let musicId = options.ids
    this.setData({
      musicId
    })
    this.getSongDetail(musicId)
    // 判断当前页面的音乐是否和在播放的歌曲是同一首歌
    if(appInstance.globalData.musicId == musicId &&  appInstance.globalData.isMusicPlay){
      this.setData({
        isplay:true
      })
    }else if(appInstance.globalData.musicId !== musicId &&  appInstance.globalData.isMusicPlay){
      // 当全局的播放音乐不相同但是处于播放状态的时候，修改isplay，发起播放请求
      this.setData({
        isplay:true
      })
      this.musicControl(true,musicId,this.data.musicLink)
    }

     // 创建控制音乐播放的实例
  this.BackgroundAudioManage = wx.getBackgroundAudioManager()
  /*
    * 问题： 如果用户操作系统的控制音乐播放/暂停的按钮，页面不知道，导致页面显示是否播放的状态和真实的音乐播放状态不一致
    * 解决方案：
    *   1. 通过控制音频的实例 backgroundAudioManager 去监视音乐播放/暂停
    *
    * */
   // 监听音乐的播放/暂停/停止
   this.BackgroundAudioManage.onPlay(()=>{
    this.changePlayState(true)
    //  修改全局音乐播放状态
    appInstance.globalData.musicId = musicId
   })
   this.BackgroundAudioManage.onPause(()=>{
    this.changePlayState(false)
   })
   this.BackgroundAudioManage.onStop(()=>{
    this.changePlayState(false)
   })
  // 监听背景影评的播放进度
  this.BackgroundAudioManage.onTimeUpdate(()=>{
    let currentTime = moment(this.BackgroundAudioManage.currentTime * 1000).format('mm:ss')
    // 实时宽度 = 实时时长 / 总时长 * 总长度
    let currentWidth = Math.floor(this.BackgroundAudioManage.currentTime / this.BackgroundAudioManage.duration * 450)
    this.setData({
      currentTime,
      currentWidth
    })
  })
  // 订阅者来自rcommendSong页面的发布消息
  PubSub.subscribe('musicId',(msg,data)=>{
   //  获取音乐详情
   this.getSongDetail(data)
  // 不能填写第三个参数，应为切歌的时后musicLink是有值得
   this.musicControl(true,data)
   //  取消订阅
  //  PubSub.unsubscribe('musicId')
  })
  // 监听音乐播放自然结束
  this.BackgroundAudioManage.onEnded(()=>{
    // 切换歌曲
    // 发布消息到rcommendSong页面
  PubSub.publish('switchType','next')
  // 重置实时进度条
  this.setData({
    currentWidth:0,
    currentTime:'00:00',//实时时间
  })
  })
  },

    // 修改播放状态的功能函数
  changePlayState(isplay){
      // 修改音乐是否的状态
      this.setData({
        isplay
      })
      // 修改全局音乐播放的状态
      appInstance.globalData.isMusicPlay = isplay;
    },
// 获取音乐详情
  async getSongDetail(musicId){
  let result = await request('/song/detail?ids='+musicId)
  let durationTime = moment(result.songs[0].dt).format('mm:ss');
  this.setData({
    songDetail:result.songs[0],
    durationTime
  })
  // 动态设置当前页面的标题
  wx.setNavigationBarTitle({
    title: this.data.songDetail.name,
  })
},
  // 点击播放/暂停的回调
  handleMusicPla(){
  let isplay = !this.data.isplay
  this.setData({
    isplay
  })
  this.musicControl(isplay,this.data.musicId,this.data.musicLink)
},
// 控制音乐的播放暂停
async musicControl(isplay,musicId,musicLink){
  if(isplay){//音乐播放
     if(!musicLink){
      let result = await request('/song/url?id='+ musicId)
      musicLink = result.data[0].url
      this.setData({
        musicLink
      })
     }
    this.BackgroundAudioManage.src = musicLink
    this.BackgroundAudioManage.title = this.data.songDetail.name
  }else{//暂停音乐
    this.BackgroundAudioManage.pause()
  }
},
// 切换歌曲 
 handleSwitch(event){
  let type = event.currentTarget.id
  // 关闭上一首播放的音乐
  this.BackgroundAudioManage.stop()
  // 发布消息到rcommendSong页面
  PubSub.publish('switchType',type)
},
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})